<script setup>
import { ref, onMounted } from 'vue';
import { ElMessage } from 'element-plus';
import axios from 'axios';

const organizationInfo = ref({
  orgId: '',
  name: '',
  password: '',
  cadminId: '',
  badminId: '',
  email: ''
});

const activities = ref([]);
const members = ref([]); // 新增成员列表

const fetchOrgInfo = async () => {
  const orgId = localStorage.getItem('loginId');
  try {
    // 获取组织主要信息
    const res = await axios.get(`http://localhost:8080/orgs/getStudentOrg/${orgId}`);
    if (res.data && res.data.code === 200) {
      organizationInfo.value = res.data.data;
    }
    // 获取组织成员列表
    const memRes = await axios.get(`http://localhost:8080/orgs/${orgId}/members`);
    if (memRes.data && memRes.data.code === 200) {
      members.value = memRes.data.data || [];
    }
    // 获取活动列表
    const actRes = await axios.get(`http://localhost:8080/orgs/${orgId}/activities`);
    if (actRes.data && actRes.data.code === 200) {
      activities.value = actRes.data.data || [];
    }
  } catch (error) {
    ElMessage.error('获取组织信息失败');
  }
};

const exportAll = () => {
  let content = `组织信息：
组织代号:${organizationInfo.value.orgId}
组织名:${organizationInfo.value.name}
C级管理员ID:${organizationInfo.value.cadminId}
B级管理员ID:${organizationInfo.value.badminId}
邮箱：${organizationInfo.value.email}

组织成员：
${members.value.map(m => m.name).join('，')}

举办的活动列表：
`;

  activities.value.forEach((act, idx) => {
    content += `
${idx + 1}. 活动ID：${act.actId}
   标题：${act.title}
   地点：${act.location}
   开始时间：${act.startTime}
   结束时间：${act.endTime}
   分数：${act.point}
   状态：${act.status}
`;
  });

  const blob = new Blob([content], { type: 'text/plain;charset=utf-8' });
  const link = document.createElement('a');
  link.href = URL.createObjectURL(blob);
  link.download = '组织档案导出.txt';
  link.click();
  URL.revokeObjectURL(link.href);

  ElMessage.success('导出成功');
};

onMounted(fetchOrgInfo);
</script>

<template>
  <div>
    <h2>组织信息</h2>
    <p><strong>组织ID：</strong>{{ organizationInfo.orgId }}</p>
    <p><strong>组织名：</strong>{{ organizationInfo.name }}</p>
    <p><strong>C级管理员ID：</strong>{{ organizationInfo.cadminId }}</p>
    <p><strong>B级管理员ID：</strong>{{ organizationInfo.badminId }}</p>
    <p><strong>邮箱：</strong>{{ organizationInfo.email }}</p>

    <p><strong>组织成员：</strong>
      <span v-if="members.length">{{ members.map(m => m.name).join('，') }}</span>
      <span v-else>无</span>
    </p>

    <el-button type="primary" @click="exportAll" style="margin: 20px 0;">导出全部信息</el-button>

    <h3 style="margin-top: 30px;">举办的活动列表</h3>
    <el-table :data="activities" style="width: 100%; margin-top: 10px;">
      <el-table-column prop="actId" label="活动ID" width="80" />
      <el-table-column prop="title" label="标题" />
      <el-table-column prop="location" label="地点" />
      <el-table-column prop="startTime" label="开始时间" />
      <el-table-column prop="endTime" label="结束时间" />
      <el-table-column prop="point" label="分数" width="70" />
      <el-table-column prop="status" label="状态" width="100" />
    </el-table>
  </div>
</template>